<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="icon" type="image/x-icon" href="../../images/logo.png">
    <title>旅游乡村监测</title>
    <link rel="stylesheet" href="../../css/reset.css">
    <link rel="stylesheet" href="../../css/common.css">
    <link rel="stylesheet" href="../../css/villageMonitoring.css">
</head>

<body>
    <div class="box">
        <!-- 头部 -->
        <div class="header-box">
                <img src="../../images/headeBg.png" alt="">
                <div class="weather-box">
                    <span>郑州 小雨转多云 32/16℃</span>
                </div>
                <h1 class="header-title"><img src="../../images/header.png" alt=""></h1>
                <div class="header-action">
                    <span class="action-time"></span>
                    <a href="javascript:;">管理中心</a>
                    <a href="javascript:;">退出</a>
                </div>
            </div>
        <div class="main-box">
            <!-- 侧边导航 -->
            <ul class="aside-box">
                    <li>
                        <a href="../home.html">
                            <span>
                                <img class="aside-img" src="../../images/home.png" alt="">
                                <img class="aside-imgA " src="../../images/homeA.png" alt="">
                                首页
                            </span>
                        </a>
                    </li>
                    <li>
                        <a href="../surroundings/development.html">
                            <span>
                                <img class="aside-img" src="../../images/huanjing.png" alt="">
                                <img class="aside-imgA" src="../../images/huanjingA.png" alt="">
                                产业发展环境
                            </span>
                        </a>
                    </li>
                    <li>
                        <a href="../basic/basic.html">
                            <span>
                                <img class="aside-img" src="../../images/yaosu.png" alt="">
                                <img class="aside-imgA" src="../../images/yaosuA.png" alt="">
                                产业基础要素
                            </span>
                        </a>
                    </li>
                    <li>
                        <a href="../passengerFlow/destination.html">
                            <span>
                                <img class="aside-img" src="../../images/keliu.png" alt="">
                                <img class="aside-imgA" src="../../images/keliuA.png" alt="">
                                旅游客流监测
                            </span>
                        </a>
                    </li>
                    <li>
                        <a href="../productTesting/index.html">
                            <span>
                                <img class="aside-img" src="../../images/chanpin.png" alt="">
                                <img class="aside-imgA" src="../../images/chanpinA.png" alt="">
                                旅游产品监测
                            </span>
                        </a>
                    </li>
                    <li class="active">
                            <a href="./scenicMonitor.html">
                                <span>
                                    <img class="aside-img" src="../../images/qiye.png" alt="">
                                    <img class="aside-imgA" src="../../images/qiyeA.png" alt="">
                                    旅游企业监测
                                </span>
                            </a>
                        </li>
                    <li>
                        <a href="../tourismProject/index.html">
                            <span>
                                <img class="aside-img" src="../../images/xiangmu.png" alt="">
                                <img class="aside-imgA" src="../../images/xiangmuA.png" alt="">
                                旅游项目监测
                            </span>
                        </a>
                    </li>
                    <li>
                        <a href="../brand/brand.html">
                            <span>
                                <img class="aside-img" src="../../images/pinpai.png" alt="">
                                <img class="aside-imgA" src="../../images/pinpaiA.png" alt="">
                                旅游品牌监测
                            </span>
                        </a>
                    </li>
                </ul>
            <!-- 主题内容 -->
            <div class="content-box">
                <div class="content-nav-box">
                    <a href="scenicMonitor.html">景区监测 </a>
                    <a href="travelAgency.html">旅行社监测</a>
                    <a href="hotelMonitoring.html">酒店监测</a>
                    <a class="active" href="#">旅游乡村监测</a>
                </div>
                <div class="main-content-box">
                    <div class="left-box">
                        <div class="selling-box">
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    热卖产品
                                </h3>
                            </div>
                            <ul>
                                <li>
                                    <p><span>河阴石榴软籽石榴大量供应</span>自家果园</p>
                                    <i><span>39.8元</span><span>美团</span><span>销售:1309</span><span>点评309</span></i>
                                </li>
                                <li>
                                    <p><span>河阴石榴软籽石榴大量供应</span>自家果园</p>
                                    <i><span>39.8元</span><span>美团</span><span>销售:1309</span><span>点评309</span></i>
                                </li>
                                <li>
                                    <p><span>河阴石榴软籽石榴大量供应</span>自家果园</p>
                                    <i><span>39.8元</span><span>美团</span><span>销售:1309</span><span>点评309</span></i>
                                </li>
                            </ul>
                        </div>
                        <div>
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    评价占比
                                </h3>
                            </div>
                            <div class="echarts-box" id="evaluate"></div>
                        </div>
                        <div>
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    热搜关键词
                                </h3>
                            </div>
                            <div class="echarts-box" id="key"></div>
                        </div>
                    </div>
                    <div class="center-box">
                        <div class="map-box">
                            <div class="info-box">
                                <div>
                                    <p>今日游客数（万人）</p>
                                    <div class="numberStyle">02124.12</div>
                                  
                                </div>
                                <div>
                                    <p>今日乡村旅游收入（万元）</p>
<!--                                    <i>-->
<!--                                        <span>0</span>-->
<!--                                        <span>0</span>-->
<!--                                        <span>0</span>-->
<!--                                        <span>6</span>-->
<!--                                        <span>4</span>-->
<!--                                        <b>.</b>-->
<!--                                        <span>5</span>-->
<!--                                        <span>2</span>-->
<!--                                    </i>-->
                                  <div class="numberStyle">0215.541</div>
                                </div>
                            </div>
                            <h4>河南乡村旅游分布图</h4>
                            <div class="map" id="allmap" style="background:url('../../images/country.png ') center no-repeat;background-size: contain"></div>
                        </div>
                        <div class="ranking-info">
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    乡村旅游
                                </h3>
                            </div>
                            <ul>
                                <li>
                                    <i></i>
                                    <span>洛阳市栾川县潭头镇重渡村</span>
                                </li>
                                <li>
                                    <i></i>
                                    <span>洛阳市栾川县潭头镇重渡村</span>
                                </li>
                                <li>
                                    <i></i>
                                    <span>洛阳市栾川县潭头镇重渡村</span>
                                </li>
                                <li>
                                    <i></i>
                                    <span>洛阳市栾川县潭头镇重渡村</span>
                                </li>
                                <li>
                                    <i></i>
                                    <span>洛阳市栾川县潭头镇重渡村</span>
                                </li>
                                <li>
                                    <i></i>
                                    <span>洛阳市栾川县潭头镇重渡村</span>
                                </li>
                                <li>
                                    <i></i>
                                    <span>洛阳市栾川县潭头镇重渡村</span>
                                </li>
                                <li>
                                    <i></i>
                                    <span>洛阳市栾川县潭头镇重渡村</span>
                                </li>
                                <li>
                                    <i></i>
                                    <span>洛阳市栾川县潭头镇重渡村</span>
                                </li>
                                <li>
                                    <i></i>
                                    <span>洛阳市栾川县潭头镇重渡村</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="right-box">
                        <div>
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    销量分析
                                </h3>
                            </div>
                            <div class="echarts-box" id="salesVolume"></div>
                            <div class="radio-box">
                                <input checked name="salesVolume" type="radio" id="provincialSales">
                                <label for="provincialSales">
                                    <i></i><span>省内</span>
                                </label>
                                <input type="radio" id="outboundSales" name="salesVolume">
                                <label for="outboundSales"><i></i><span>处境</span></label>
                                <input type="radio" id="inboundSales" name="salesVolume">
                                <label for="inboundSales"><i></i><span>入境</span></label>
                            </div>
                        </div>
                        <div>
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    收入分析
                                </h3>
                            </div>
                            <div class="echarts-box" id="income"></div>
                            <div class="radio-box">
                                <input checked name="Income" type="radio" id="provincialIncome">
                                <label for="provincialIncome">
                                    <i></i><span>省内</span>
                                </label>
                                <input type="radio" id="outboundIncome" name="Income">
                                <label for="outboundIncome"><i></i><span>处境</span></label>
                                <input type="radio" id="inboundIncome" name="Income">
                                <label for="inboundIncome"><i></i><span>入境</span></label>
                            </div>
                        </div>
                        <div class="">
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    河南省旅游收入占比
                                </h3>
                            </div>
                            <div class="echarts-box" id="HenanProvince"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script src="../../plugin/jquery-1.11.1.min.js"></script>
<script src="../../plugin/ECharts/echarts.js"></script>
<script src="../../plugin/ECharts/echarts-wordcloud.min.js"></script>
<script src="../../js/common.js"></script>
<script src="../../js/jquery.leoTextAnimate.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=RbLCQuGNfG1cQrKmywquV6wEEkoVkyNY"></script>
<script src="../../js/villageMonitoring.js"></script>
<script>
    let liList = $('.ranking-info ul li')
    for(let i= 0;i<liList.length;i++){
        $('.ranking-info ul li').eq(i).children('i').text(i+1)
    }
    // var map = new BMap.Map("allmap");
    // // var map = new BMap.Map("map",{minZoom : 7, maxZoom : 18 });                        // 创建Map实例
    // map.centerAndZoom(new BMap.Point(113.64964385,34.756610066), 8);     // 初始化地图,设置中心点坐标和地图级别
    // map.enableScrollWheelZoom();

    // var cityName = '河南省';
    // map.addControl(new BMap.OverviewMapControl());              //添加缩略地图控件
    // map.enableScrollWheelZoom();
    // map.addControl(new BMap.NavigationControl({ type: BMAP_NAVIGATION_CONTROL_LARGE ,anchor: BMAP_ANCHOR_TOP_LEFT, offset: new BMap.Size(40, 250)}));
    //     var bdary = new BMap.Boundary();
    //     bdary.get(cityName, function (rs) {       //获取行政区域       
    //         var EN_JW = "180, 90;";         //东北角
    //         var NW_JW = "-180,  90;";       //西北角
    //         var WS_JW = "-180, -90;";       //西南角
    //         var SE_JW = "180, -90;";        //东南角
    //         //4.添加环形遮罩层
    //         var ply1 = new BMap.Polygon(rs.boundaries[0] + SE_JW + SE_JW + WS_JW + NW_JW + EN_JW + SE_JW, { strokeColor: "none", fillColor: "rgba(0,0,0,.2)", fillOpacity:1, strokeOpacity: 0.5 }); //建立多边形覆盖物
    //         map.addOverlay(ply1);  
    //      });

    $('.numberStyle').leoTextAnimate({
      delay: 1000, //延时出现时间
      autorun: true, //是否自动运行
      fixed: [',', ':', '.'], //
      start: '0'
    })
</script>
</html>
